<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      /*
                         Object.defineProperties();  方法直接在一个对象上定义新的属性或修改现有属性，并返回该对象
                         * configurable  描述是否可以删除 默认是false
                         * enumerable 是否枚举 默认是false
                         * value 属性值 默认是undefined
                         * writable 是否可以编辑 默认是false
                         * get 作为属性的getter  是函数 默认 undefined
                         * set 作为属性的setter  是函数 默认 undefined
                       */
      let obj = {};
      Object.defineProperty(obj, 'name', {
        value: 'aa',
        writable: true, //默认是false 如果是false 无法进行修改
      });
      console.log(obj.name); //aa
      obj.name = 'bb';
      console.log(obj.name); //bb

      // configurable 默认是false 如果是false 无法进行修改或者删除
      let obj2 = {};
      Object.defineProperty(obj2, 'name', {
        value: 'aa',
        configurable: true, //默认是false 如果是false 无法删除
      });
      delete obj2.name;
      console.log(obj2); //{}

      //enumerable 描述属性是否会出现在for in 或者 Object.keys()的遍历中
      let obj3 = {};
      Object.defineProperty(obj3, 'name', {
        value: 'aa',
        writable: true,
        enumerable: true, //默认是false 如果是false 无法进行循环列举 循环不会有反应
      });
      for (let key in obj3) {
        console.log(key);
      }

      //set get
      let obj4 = {};
      let temp;
      Object.defineProperty(obj4, 'name', {
        get: function () {
          return temp;
        },
        set: function (val) {
          temp = val;
        },
      });
      console.log(obj4.name); //undefined
      obj4.name = 'bb';
      console.log(obj4.name); //bb
    </script>
  </body>
</html>
